<template>
  <div>
    <div class="header">
      <div class="logoDiv">
        <img :src="logo" />
      </div>
      <div class="header-right-div">

      </div>
    </div>
  </div>
</template>
<script setup>
import logo from '../../assets/logo.png'

</script>

<style lang="scss" scoped >
.header {
  height: 44px;
  line-height: 44px;
  width: 100%;
  background: linear-gradient(
    145deg,
    rgba(34, 39, 48, 1) 0%,
    rgba(42, 51, 68, 1) 100%
  );
}
.header .logoDiv {
  float: left;
  height: 44px;
  width: 220px;
  position: relative;
  img {
    position: absolute;
    top: 0;
    left: 40px;
    bottom: 0;
    margin: auto;
    width: 36px;
    height: 36px;
  }
}
.header .header-right-div {
  float: right;
  height: 44px;
  line-height: 44px;
  margin-right: 16px;
}
.header ul {
  margin-top: 0px;
  list-style-type: none;
  li {
    cursor: pointer;
    height: 44px;
    line-height: 44px;
    float: left;
    color: #ffffff;
    font-family: PingFang SC;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    margin: 0px 10px 0px 10px;
    .liTxt {
      max-width: 100px;
      margin-right: 8px;
      height: 44px;
      line-height: 44px;
      float: left;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
    }
  }
}

.header li .liIcon {
  float: left;
  margin: 0px 5px 0px 0px;
}
.header .dropdownMenuDiv {
  height: 44px;
}
.header .dropdownMenuDiv.user {
  padding-right: 56px;
}
.header .dropdownMenuDiv:hover {
  color: #20ccc6;
  -webkit-transition: all 0.15s;
  -moz-transition: all 0.15s;
  -ms-transition: all 0.15s;
  -o-transition: all 0.15s;
  transition: all 0.15s;
  // border-bottom: 1px solid #20ccc6;
}

.right-border {
  display: inline-block;
  border-left: 1px solid #edf5fc;
  text-align: center;
  height: 165px;
  margin-top: 20px;
}
</style>
